import React from 'react'
import Control from '../components/control'
import Panl from "../components/panl";
import { message } from 'antd';
import { Modal } from 'antd';
import isFiveSuccess from "../until/FiveSuccess";

export default class Gobang extends React.Component{
    constructor() {
        super();
        this.state=this.init()
    }
    //下棋之后
    coord(col,row){
        //获取下棋的坐标
        console.log(row,col)
        //判断该坐标是否已经下棋
        if(this.state.data[row][col]!==0){
            return
        }
        //判断是否胜利
        if(this.state.success){
            message.info('游戏已经结束，请重新开始')
            return;
        }
        //添加下棋历史，方便晦气
        this.state.bangList.push(JSON.stringify(this.state.data))
        console.log(this.state.bangList)
        //根据下棋位置，改变data数组
        let list = this.state.data
        //判断是否是白棋，黑棋 更改对应的数据 白1 黑2
        if(this.state.isBalck){
            list[row][col] = 1
            this.setState({
                isBalck:false,
                data:list
            })

        }else {
            list[row][col] = 2
            this.setState({
                isBalck:true,
                data:list
            })
        }
        //下棋之后，根据数组判断是否胜利
        this.setState({
            success:isFiveSuccess(list,row,col)
        })
        console.log(isFiveSuccess(list,row,col))
        //如果胜利，提示
        if(isFiveSuccess(list,row,col)){
            message.info('赢了')
        }
    }
    //初始化数据
    init(){
        let data = [];
        for(let i=0;i<15;i++){
            data.push(new Array(15).fill(0))
        }
        return {
            data,
            isBalck:true,
            success:false,
            bangList:[]
        }
    }
    //重置棋盘
    setinit(){
        this.setState(this.init())
    }
    //悔棋
    back(){
        //判断历史数组，长度为0择无法晦棋
        if(this.state.bangList.length===0){
            message.info('你已经没有棋可悔了')
            return;
        }
        //对话框
        Modal.confirm({
            title: '提示',
            //点击成功之后
            onOk:()=>{
                //取出上一个历史记录，赋值给data
                let list = JSON.parse(this.state.bangList.pop())
                this.setState({
                    data:list
                })
            },
            content: '你确定要悔棋吗？',
            okText: '确认',
            cancelText: '取消',
        });
    }

    render() {
        // console.log(this.state.data)
        const {data} = this.state
        return (
            <div className="go-bang">
                {/*//控制组件*/}
                <Control init={this.setinit.bind(this)} back={this.back.bind(this)}/>
                {/*//面板组件*/}
                <Panl data={data} coordinates={this.coord.bind(this,)}/>
            </div>
        )
    }
}